<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>Alert</title>
		<script>
		//直接在网页弹出,alert警告框会根据浏览器的不同显示出不同的样式
//			alert("弹出警告");
			function showClick(){
				alert("由点击事件触发的警告！");
			}
			function choose(){
				var result = confirm("确定点击？");
				var resultDiv = document.getElementById("show_click");
				if(result == true)
				{
					resultDiv.innerHTML="确定点击";
				}
				else{
					resultDiv.innerHTML="确定不点击，还是点了";
				}
			}
			
			function btnClick(){
				prompt("你是否还在爱着我");
			}
		</script>
		<style>
			#show_click {
				width: 200px;
				height: 100px;
				border: 2px dashed red;
			}
			.choose_dialog {
				width: 100px;
				height: 100px;
				margin: 20px;
				background-color: black;
				color: white;
			}
		</style>
	</head>
	<body>
		<!--点击事件-->
		<!--PC端，移动端的产品都会对用户提供鼠标点击
			或触屏操作的功能
			网页要做出响应，这个响应就叫做点击事件	
			在HTML中，所有的标签都可以设置点击事件
			用户鼠标点击时要给出回馈操作
			1.定义标签，设置id
			2.在js代码中提供点击函数
			3.在标签描述中设置点击事件onclick为该点击函数
		-->
		<div id="show_click" onclick="showClick()">请触发点击事件</div>
		
		<div class="choose_dialog" onclick="choose()">请再次确认你的选择</div>
		
		<input type="button" value="请输入" onclick="btnClick()"/>
	</body>
</html>
